<template>
    <popup-base title="即将开始游戏"
                imgSrc="../../../../static/img/longmao.gif"
                failText="继续观望"
                :successText="startGame"
                v-if="popupStatus"
                v-on:success="success()"
                v-on:fail="fail()"
    >
    </popup-base>
</template>
<style lang="less">
    @import "../../../less/popup";
</style>
<script>
    import popupBase from './base.vue'

    let time = null
    export default {
        props: ['width', 'popupStatus'],
        components: {
            popupBase
        },
        data() {
            return {
                startGame: '',
            }
        },
        watch: {
            popupStatus: function () {
                var self = this
                var num = 6
                self.startGame = '准备好了（' + 6 + '）'
                if (this.popupStatus) {
                    time = setInterval(
                        function () {
                            if (num == 0) {
                                clearInterval(time)
                            }
                            self.startGame = '准备好了（' + num + '）'
                            num--;
                        }, 1000)
                } else {
                    clearInterval(time);
                }
            }
        },
        methods: {
            fail() {
                this.$emit('fail')
                this.$emit('update:popupStatus', false)
            },
            success() {
                this.$emit('success')
                this.$emit('update:popupStatus', false)
            }
        },
        mounted() {

        }
    }
</script>